<template>
  <div id="app">
    <div class="main" :style="{height:'100%'}">
      <router-view></router-view>
    </div>
    <footerNav :showNav="showNav"></footerNav>
  </div>
  
</template>

<script>
import footerNav from './components/footerNav.vue'
export default {
  name: 'app',
  data () {
    return {
      direction: 'forward',
      showNav: true
    }
  },
  components: {
    footerNav
  },
   watch: {
     // 如果路由有变化，会执行该方法
    '$route': function() {
      this.routeChange()
    }
  },
  methods: {
    routeChange () {
      let path = this.$route.path
      if (path === '/' || path === '/cinema' || path === '/me') {
        this.showNav = true
      } else {
        this.showNav = false
      }
    }
  },
  created () {
    this.routeChange()
  },
  mounted () {
    window.setTimeout(() => {
      document.documentElement.scrollTop = 0
      document.body.scrollTop = 0
    }, 200)
  }
}
</script>

<style>
  *{
    margin:0;
    padding: 0;
    box-sizing: border-box;
  }
  body {
    background: #f5f5f5;
  }
  .main{
    padding-bottom: 60px;
  }
</style>